<template>
  <div>
    <div class="user-info">
      <div class="head">
        <el-row>
          <el-col :span="4">
            <div class="img">
              <Avatar src="../../../static/images/defaultHeadImage.jpg" size="large"/>
            </div>
          </el-col>
          <el-col :span="16">
            <div class="info"> 赵丽颖</div>
          </el-col>
          <el-col :span="4">
            <div class="setting"> 设置</div>
          </el-col>
        </el-row>

        <div class="details">
          <el-row>
            <el-col :span="6">
              <div>收藏夹(6)</div>
            </el-col>
            <el-col :span="6">
              <div> 关注店铺(2)</div>
            </el-col>
            <el-col :span="6">
              <div> 足迹</div>
            </el-col>
            <el-col :span="6">
              <div> 卡卷(2)</div>
            </el-col>
          </el-row>
        </div>
      </div>
    </div>
    <el-card class="order-card">
      <div slot="header" class="clearfix">
        <span>我的订单</span>
        <el-button style="float: right; padding: 3px 0" type="text">查看全部订单</el-button>
      </div>
      <el-row>
        <el-col :span="6">
          <div class="order-block">
            <div>
              <van-icon name="pending-payment" size="2em" info="1"/>
            </div>
            <div>待付款</div>
          </div>
        </el-col>
        <el-col :span="6">
          <div class="order-block">
            <div>
              <van-icon name="logistics" size="2em"/>
            </div>
            <div>待收货</div>
          </div>
        </el-col>
        <el-col :span="6">
          <div class="order-block">
            <div>
              <van-icon name="pending-evaluate" size="2em" info="5"/>
            </div>
            <div>待评价</div>
          </div>
        </el-col>
        <el-col :span="6">
          <div class="order-block">
            <div>
              <van-icon name="cash-back-record" size="2em" info="1"/>
            </div>
            <div>退款/售后</div>
          </div>
        </el-col>
      </el-row>
    </el-card>

    <div class="user-utils">

    </div>

    <div class="card-add">

    </div>
  </div>

</template>

<style lang="less">
  @import "../../assets/less/index.less";
</style>
